<template>
  <div class="task_type">
    <span class="state_icon_color" :class="stateColor">{{data.taskTypeLabel}}</span>
  </div>
</template>

<script>
export default {
  name: 'TaskType',
  props: {
    data: Object
  },
  computed: {
    // 根据任务类型返回相应class
    stateColor() {
      switch (this.data.taskTypeValue) {
        case 'Normal':
          // 正常
          return 'batch_task_normal'
        case 'Rework':
          // 返工
          return 'batch_task_rework'
        case 'Repair':
          // 返修
          return 'batch_task_repair'
        case 'Discard':
          // 报废重投
          return 'batch_task_discard'
        case 'ReturnMaterial':
          // 退料再处理
          return 'batch_task_return_material'
        default:
          return ''
      }
    }
  }
}
</script>

<style scoped lang="less">
  /* 任务类型颜色 */
  // 正常
  @mesBatchNormal: #33cc66;
  // 返工
  @mesBatchRework: #00b4ff;
  // 返修
  @mesBatchRepair: #006fb3;
  // 报废重投
  @mesBatchDiscard: #ff931f;
  // 退料再处理
  @mesBatchReturnMaterial: #f8000f;

  .task_type{
    .state_icon_color{
      /*批次任务类型*/
      // 正常
      &.batch_task_normal:before{
        background-color: @mesBatchNormal;
      }
      // 返工
      &.batch_task_rework:before{
        background-color: @mesBatchRework;
      }
      // 返修
      &.batch_task_repair:before{
        background-color: @mesBatchRepair;
      }
      // 报废重投
      &.batch_task_discard:before{
        background-color: @mesBatchDiscard;
      }
      // 退料再处理
      &.batch_task_return_material:before{
        background-color: @mesBatchReturnMaterial;
      }
    }
  }
</style>
